<link rel="stylesheet" type="text/css" href="<?php echo css_url().'user_group3/login-signup.css'?>">
<div id="body-login">
    
    <button id="facebook-login" > 
        <span>Login with Facebook</span>
    </button>

    <div class="hr"></div>
    
    <form id="login-form" method="POST">
        <div class="error"></div>
        <ol>
            <li>
                <input class="text" id="email" type="text" placeholder="Email-Address" name='UserEmail'/>
            </li>
            
            <li>
                <input class="text" id="password" type="password" placeholder="Password" name='UserPassword'/>
            </li>
            
            <li>
                <div id="login-bt">Login</div>
            </li>
        </ol>
    </form>
    
    <div class="hr"></div>
    
    <p>Don't have an account ? <a id='button-signup-ref' href="#signup"style='text-decoration: none; color: #44B7E9'>Sign up now!</a></p>
</div>

<?php include js_url(true).'validate_things.php'; ?>
<script type="text/javascript"> 
    $("div.error").hide();
    $("#body-signup").hide();
    $("#body-signup").show("fast");
    $("a#button-signup-ref").on("click",function(){
        $("a.button-signup").click();
    });
    
    
    function CheckUser(UserEmail, UserPassword){
        UserEmail = encodeURIComponent(UserEmail);
        url_link = "<?php echo site_url()."/login/checkuser/"?>"+UserEmail+"/"+UserPassword;
        $.ajax({
            url : url_link,
            type: 'post',
            async: false,
            success: function(data){
                isTrue = data;
            } 
        });
        if(isTrue == 0){
            return false;
        }
        else{
            return true;
        }
    }
    
    $("div#login-bt").on("click",function(){
        UserEmail = $("#email").val();
        UserPassword = md5($("#password").val());
        if(CheckUser(UserEmail, UserPassword) == true){
            $("#password").val(UserPassword);
            $("#login-form").attr('action','<?php echo site_url().'/login/'?>')
            $("#login-form").submit();
        }
        else{
            $("input#email").attr("class","text-error");
            $("input#password").attr("class","text-error");
            $("div.error").text("Email does not exist or wrong password").show();
        }
    });
</script>